<template>
  <view class="container">
    <view class="search">
      <search class="fl2 search-input" :val.sync="keyword" @change="goSearch" />
      <view class="primary_btn fl1" @tap="add"> 新增 </view>
    </view>
    <u-list @scrolltolower="scrolltolower">
      <u-list-item v-for="(item, index) in workLogList" :key="index">
        <view class="item-wrap">
          <work-log class="work_log" :data="item" />
        </view>
      </u-list-item>
    </u-list>
  </view>
</template>

<script>
import pageMixin from '@/mixins/pageMixin'
import { workLogList } from '@/service/api/common_down'
import Search from '@/components/search.vue'
import WorkLog from '@/components/workLog.vue'
export default {
  name: 'list',
  mixins: [pageMixin],
  components: {
    Search,
    WorkLog,
  },
  data() {
    return {
      keyword: '',
      size: 999,
      page: 1,
      workLogList: [],
      end: false,
    }
  },
  onShow() {
    uni.$on('refreshData', res => {
      if (res.refresh) {
        //更新数据
        this.refreshData()
      }
    })
  },
  created() {},
  mounted() {},
  onLoad() {
    this.getWorkLogList()
  },
  methods: {
    goSearch() {
      console.log(this.keyword)
      this.refreshData()
    },
    refreshData() {
      this.end = false
      this.page = 1
      this.workLogList = []
      this.getWorkLogList()
    },
    add() {
      uni.navigateTo({
        url: `/pageAttendance/pages/workLog/addWorkLog`,
      })
    },
    getWorkLogList() {
      const _this = this
      const data = {
        size: this.size,
        page: this.page,
        sort: 'id desc',
        keyword: this.keyword,
      }
      this.uniShowLoading()
      workLogList(data)
        .then(res => {
          this.uniHideLoading()
          uni.stopPullDownRefresh()
          console.log(res)
          if (res.data.content.length < this.size) this.end = true
          this.workLogList = this.workLogList.concat(res.data.content)
        })
        .catch(err => {
          this.uniHideLoading()
          uni.stopPullDownRefresh()
        })
    },
    scrolltolower() {
      console.log('end='+this.end)
      if (this.end) return
      this.page++
      this.getWorkLogList()
    },
    onPullDownRefresh() {
      this.refreshData()
    },
  },
}
</script>
<style scoped lang="scss">
.container {
  background-color: #f4f5f9;
  padding: 20rpx 0;
  .search {
    display: flex;
    margin: 0 20rpx;
    .search-input {
      margin-right: 20rpx;
    }
    .primary_btn {
      margin-left: 20rpx;
    }
  }
  .item-wrap {
    background-color: white;
    border-radius: 10rpx;
    margin: 20rpx 20rpx 0;

  }
}
</style>
